import React from "react";
import { Marker, PointLayer } from "@antv/l7-react";
import { Button, Popover } from "antd";
import { history } from "umi";

const AMarker: React.FC<any> = (props) => {
  const { list, onDetail } = props;

  const plist = list.map((item: any) => {
    return {
      controlPlan: item.controlPlan,
      centroid: item.lnglat,
      countryName: item.title,
      countryEnglishName: "Algeria",
      currentConfirmedCount: 1059,
      confirmedCount: 1251,
      suspectedCount: 0,
      curedCount: 62,
      deadCount: 130,
    };
  });
  return (
    <>
      {list.map((item: any, index: number) => (
        <Marker
          key={`m${index}`}
          lnglat={item.lnglat}
          option={{ style: { zIndex: 99999 }, offsets: [0, -5] }}
        >
          {item.controlPlan ? (
            <Popover
              placement="topLeft"
              content={item.title}
              style={{ width: "100%" }}
            >
              <svg
                version="1.1"
                xmlns="http://www.w3.org/2000/svg"
                p-id="4230"
                width="200"
                height="200"
              >
                <path
                  d="M105.550769 647.483077m-39.384615 0a39.384615 39.384615 0 1 0 78.769231 0 39.384615 39.384615 0 1 0-78.769231 0Z"
                  fill="#D7E9FF"
                  p-id="4231"
                ></path>
                <path
                  d="M452.135385 647.483077m-39.384616 0a39.384615 39.384615 0 1 0 78.769231 0 39.384615 39.384615 0 1 0-78.769231 0Z"
                  fill="#D7E9FF"
                  p-id="4232"
                ></path>
                <path
                  d="M656.935385 647.483077m-39.384616 0a39.384615 39.384615 0 1 0 78.769231 0 39.384615 39.384615 0 1 0-78.769231 0Z"
                  fill="#D7E9FF"
                  p-id="4233"
                ></path>
                <path
                  d="M916.873846 655.36h-189.046154l-31.507692-31.507692h189.046154zM412.750769 623.852308l-31.507692 31.507692h-204.8l-31.507692-31.507692z"
                  fill="#5C9EFF"
                  p-id="4234"
                ></path>
                <path
                  d="M790.843077 482.067692h-173.292308v-47.261538h127.606154c4.726154 4.726154 9.452308 9.452308 14.178462 15.753846 9.452308 12.603077 20.48 23.630769 31.507692 31.507692z"
                  fill="#D7E9FF"
                  p-id="4235"
                ></path>
                <path
                  d="M806.596923 493.095385l-15.753846-11.027693h-173.292308v-47.261538h127.606154l-20.48-15.753846c-51.987692-31.507692-121.304615-31.507692-121.304615-31.507693h-582.892308v47.261539h362.338462v47.261538h-362.338462v141.784616h913.723077c7.876923 0 15.753846-7.876923 15.753846-15.753846v-15.753847c-1.575385-48.836923-80.344615-58.289231-143.36-99.24923z"
                  fill="#94C1FF"
                  p-id="4236"
                ></path>
                <path
                  d="M806.596923 493.095385l-15.753846-11.027693c-11.027692-9.452308-22.055385-18.904615-31.507692-31.507692-4.726154-6.301538-9.452308-11.027692-14.178462-15.753846l-20.48-15.753846c-51.987692-31.507692-121.304615-31.507692-121.304615-31.507693h-582.892308v15.753847h567.138462s69.316923 0 121.304615 31.507692l20.48 15.753846c4.726154 4.726154 9.452308 9.452308 14.178461 15.753846 9.452308 12.603077 20.48 22.055385 31.507693 31.507692l15.753846 11.027693c63.015385 40.96 141.784615 50.412308 141.784615 97.673846v15.753846c7.876923 0 15.753846-7.876923 15.753846-15.753846v-15.753846c0-47.261538-78.769231-56.713846-141.784615-97.673846z"
                  fill="#D7E9FF"
                  p-id="4237"
                ></path>
                <path
                  d="M729.403077 450.56c4.726154 4.726154 11.027692 9.452308 14.178461 15.753846 4.726154 6.301538 9.452308 11.027692 14.178462 15.753846h33.083077c-11.027692-9.452308-22.055385-18.904615-31.507692-31.507692-4.726154-6.301538-9.452308-11.027692-14.178462-15.753846H708.923077l20.48 15.753846z"
                  fill="#FFFFFF"
                  p-id="4238"
                ></path>
                <path
                  d="M381.243077 434.806154v47.261538h-362.338462v-47.261538zM18.904615 356.036923h126.03077v31.507692h-126.03077z"
                  fill="#D7E9FF"
                  p-id="4239"
                ></path>
                <path
                  d="M601.796923 395.421538h-582.892308c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h582.892308c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM948.381538 615.975385c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-15.753847c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876924 7.876923v15.753847c0 4.726154-3.150769 7.876923-7.876924 7.876923z"
                  fill="#116FFF"
                  p-id="4240"
                ></path>
                <path
                  d="M723.101538 426.929231c-1.575385 0-3.150769 0-4.726153-1.575385-50.412308-29.932308-116.578462-29.932308-118.153847-29.932308-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923c3.150769 0 72.467692 0 126.03077 33.083077 3.150769 1.575385 4.726154 7.876923 3.150769 11.027693 0 1.575385-3.150769 3.150769-6.301539 3.150769zM790.843077 489.944615c-1.575385 0-3.150769 0-4.726154-1.575384-12.603077-9.452308-23.630769-20.48-33.083077-33.083077-3.150769-4.726154-7.876923-9.452308-14.178461-14.178462-3.150769-3.150769-3.150769-7.876923 0-11.027692 3.150769-3.150769 7.876923-3.150769 11.027692 0 6.301538 4.726154 11.027692 11.027692 15.753846 17.329231 7.876923 11.027692 17.329231 20.48 29.932308 29.932307 3.150769 3.150769 4.726154 7.876923 1.575384 11.027693-1.575385 1.575385-4.726154 1.575385-6.301538 1.575384zM948.381538 600.221538c-4.726154 0-7.876923-3.150769-7.876923-7.876923 0-26.781538-31.507692-40.96-70.892307-58.28923-20.48-9.452308-45.686154-20.48-67.741539-34.658462-3.150769-1.575385-4.726154-7.876923-3.150769-11.027692 1.575385-3.150769 7.876923-4.726154 11.027692-3.150769 20.48 14.178462 44.110769 23.630769 64.59077 33.083076 42.535385 18.904615 80.344615 34.658462 80.344615 72.467693 1.575385 4.726154-1.575385 9.452308-6.301539 9.452307zM932.627692 631.729231h-913.723077c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h913.723077c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM916.873846 663.236923h-189.046154c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h189.046154c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4241"
                ></path>
                <path
                  d="M727.827692 663.236923c-1.575385 0-4.726154 0-6.301538-1.575385l-15.753846-15.753846c-3.150769-3.150769-3.150769-7.876923 0-11.027692s7.876923-3.150769 11.027692 0l15.753846 15.753846c3.150769 3.150769 3.150769 7.876923 0 11.027692-1.575385 1.575385-3.150769 1.575385-4.726154 1.575385zM656.935385 694.744615c-26.781538 0-47.261538-20.48-47.261539-47.261538 0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 17.329231 14.178462 31.507692 31.507693 31.507692s31.507692-14.178462 31.507692-31.507692c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 26.781538-22.055385 47.261538-47.261538 47.261538zM570.289231 663.236923c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-15.753846c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v15.753846c0 4.726154-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4242"
                ></path>
                <path
                  d="M656.935385 663.236923h-86.646154c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h86.646154c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM176.443077 663.236923c-1.575385 0-4.726154 0-6.301539-1.575385l-15.753846-15.753846c-3.150769-3.150769-3.150769-7.876923 0-11.027692s7.876923-3.150769 11.027693 0l15.753846 15.753846c3.150769 3.150769 3.150769 7.876923 0 11.027692-1.575385 1.575385-3.150769 1.575385-4.726154 1.575385zM105.550769 694.744615c-26.781538 0-47.261538-20.48-47.261538-47.261538 0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 17.329231 14.178462 31.507692 31.507692 31.507692s31.507692-14.178462 31.507693-31.507692c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 26.781538-22.055385 47.261538-47.261539 47.261538zM18.904615 663.236923c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-15.753846c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v15.753846c0 4.726154-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4243"
                ></path>
                <path
                  d="M105.550769 663.236923H18.904615c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h86.646154c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM381.243077 663.236923h-204.8c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h204.8c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4244"
                ></path>
                <path
                  d="M381.243077 663.236923c-1.575385 0-4.726154 0-6.301539-1.575385-3.150769-3.150769-3.150769-7.876923 0-11.027692l15.753847-15.753846c3.150769-3.150769 7.876923-3.150769 11.027692 0s3.150769 7.876923 0 11.027692l-15.753846 15.753846c-1.575385 1.575385-3.150769 1.575385-4.726154 1.575385zM452.135385 694.744615c-26.781538 0-47.261538-20.48-47.261539-47.261538 0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 17.329231 14.178462 31.507692 31.507693 31.507692s31.507692-14.178462 31.507692-31.507692c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923c0 26.781538-22.055385 47.261538-47.261538 47.261538zM538.781538 663.236923c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-15.753846c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876924 7.876923v15.753846c0 4.726154-3.150769 7.876923-7.876924 7.876923z"
                  fill="#116FFF"
                  p-id="4245"
                ></path>
                <path
                  d="M538.781538 663.236923h-86.646153c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h86.646153c4.726154 0 7.876923 3.150769 7.876924 7.876923s-3.150769 7.876923-7.876924 7.876923zM790.843077 489.944615h-173.292308c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h173.292308c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM745.156923 442.683077h-127.606154c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h127.606154c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM586.043077 615.975385c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-126.03077c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v126.03077c0 4.726154-3.150769 7.876923-7.876923 7.876923zM523.027692 615.975385c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-126.03077c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v126.03077c0 4.726154-3.150769 7.876923-7.876923 7.876923zM381.243077 442.683077h-362.338462c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h362.338462c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4246"
                ></path>
                <path
                  d="M381.243077 489.944615c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-47.261538c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v47.261538c0 4.726154-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4247"
                ></path>
                <path
                  d="M381.243077 489.944615h-362.338462c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h362.338462c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM586.043077 489.944615h-63.015385c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h63.015385c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM617.550769 489.944615c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-47.261538c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v47.261538c0 4.726154-3.150769 7.876923-7.876923 7.876923zM932.627692 631.729231c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923 7.876923-3.150769 7.876923-7.876923 3.150769-7.876923 7.876923-7.876924 7.876923 3.150769 7.876924 7.876924c0 12.603077-11.027692 23.630769-23.63077 23.630769zM916.873846 663.236923c-1.575385 0-4.726154 0-6.301538-1.575385l-15.753846-15.753846c-3.150769-3.150769-3.150769-7.876923 0-11.027692s7.876923-3.150769 11.027692 0l15.753846 15.753846c3.150769 3.150769 3.150769 7.876923 0 11.027692-1.575385 1.575385-3.150769 1.575385-4.726154 1.575385zM1011.396923 710.498462h-992.492308c-4.726154 0-7.876923-3.150769-7.876923-7.876924s3.150769-7.876923 7.876923-7.876923h992.492308c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876924zM192.196923 537.206154h-173.292308c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h173.292308c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM113.427692 584.467692h-94.523077c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h94.523077c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM144.935385 363.913846h-126.03077c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h126.03077c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4248"
                ></path>
                <path
                  d="M144.935385 379.667692c-4.726154 0-7.876923-3.150769-7.876923-7.876923v-15.753846c0-4.726154 3.150769-7.876923 7.876923-7.876923s7.876923 3.150769 7.876923 7.876923v15.753846c0 4.726154-3.150769 7.876923-7.876923 7.876923zM1011.396923 474.190769h-92.947692c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h92.947692c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM885.366154 474.190769h-15.753846c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876923h15.753846c4.726154 0 7.876923 3.150769 7.876923 7.876923s-3.150769 7.876923-7.876923 7.876923zM932.627692 411.175385h-157.538461c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876924h157.538461c4.726154 0 7.876923 3.150769 7.876923 7.876924s-3.150769 7.876923-7.876923 7.876923zM979.889231 411.175385h-15.753846c-4.726154 0-7.876923-3.150769-7.876923-7.876923s3.150769-7.876923 7.876923-7.876924h15.753846c4.726154 0 7.876923 3.150769 7.876923 7.876924s-3.150769 7.876923-7.876923 7.876923z"
                  fill="#116FFF"
                  p-id="4249"
                ></path>
              </svg>
            </Popover>
          ) : (
            <Popover
              placement="topLeft"
              title={item.title}
              content={
                <Button
                  type="dashed"
                  onClick={() =>
                    history.push({
                      pathname: `/dashboard/timingPlan/${item.id}`,
                    })
                  }
                  style={{ width: "100%" }}
                >
                  添加
                </Button>
              }
            >
              <svg
                viewBox="0 0 1024 1024"
                version="1.1"
                xmlns="http://www.w3.org/2000/svg"
                p-id="7971"
                width="36"
                height="36"
              >
                <path
                  d="M508.5 328.5m-70.28 0a70.28 70.28 0 1 0 140.56 0 70.28 70.28 0 1 0-140.56 0Z"
                  p-id="7972"
                  fill="#5b8ff9"
                ></path>
                <path
                  d="M508.5 554.96m-94.37 0a94.37 94.37 0 1 0 188.74 0 94.37 94.37 0 1 0-188.74 0Z"
                  p-id="7973"
                  fill="#5b8ff9"
                ></path>
                <path
                  d="M508.5 803.08c-105.35 0-191.07-85.71-191.07-191.07V304.3c0-105.35 85.71-191.07 191.07-191.07s191.07 85.71 191.07 191.07v307.72c-0.01 105.35-85.72 191.06-191.07 191.06z m0-638.48c-77.03 0-139.7 62.67-139.7 139.7v307.72c0 77.03 62.67 139.7 139.7 139.7s139.7-62.67 139.7-139.7V304.3c0-77.03-62.67-139.7-139.7-139.7z"
                  p-id="7974"
                  fill="#5b8ff9"
                ></path>
                <path
                  d="M508.22 902.45h-0.15c-14.18-0.08-25.62-11.64-25.54-25.83l0.56-99.37c0.08-14.13 11.56-25.54 25.68-25.54h0.15c14.18 0.08 25.62 11.64 25.54 25.83l-0.56 99.37c-0.08 14.14-11.56 25.54-25.68 25.54z"
                  p-id="7975"
                  fill="#5b8ff9"
                ></path>
                <path
                  d="M673.88 909.15H343.11c-14.18 0-25.68-11.5-25.68-25.68s11.5-25.68 25.68-25.68h330.77c14.18 0 25.68 11.5 25.68 25.68s-11.5 25.68-25.68 25.68z"
                  p-id="7976"
                  fill="#5b8ff9"
                ></path>
              </svg>
            </Popover>
          )}
        </Marker>
      ))}
      <PointLayer
        key="p1"
        source={{
          data: plist.filter((e: any) => e.controlPlan),
          parser: {
            type: "json",
            coordinates: "centroid",
          },
        }}
        scale={{
          values: {
            confirmedCount: {
              type: "log",
            },
          },
        }}
        color={{
          values: "#3fae1a",
        }}
        shape={{
          values: "circle",
        }}
        active={{
          option: {
            color: "#3fae1a",
          },
        }}
        size={{
          field: "confirmedCount",
          values: [5, 100],
        }}
        animate={{
          enable: true,
        }}
        style={{
          zIndex: 99999,
          opacity: 0.6,
        }}
      />
      <PointLayer
        key="p2"
        source={{
          data: plist ? plist.filter((e: any) => !e.controlPlan) : [],
          parser: {
            type: "json",
            coordinates: "centroid",
          },
        }}
        scale={{
          values: {
            confirmedCount: {
              type: "log",
            },
          },
        }}
        color={{
          values: "#5b8ff9",
        }}
        shape={{
          values: "circle",
        }}
        active={{
          option: {
            color: "#5b8ff9",
          },
        }}
        size={{
          field: "confirmedCount",
          values: [5, 100],
        }}
        animate={{
          enable: true,
        }}
        style={{
          opacity: 0.6,
        }}
      />
    </>
  );
};

export default AMarker;
